﻿<!doctype html>
<html>
<head>
<style>
  html, body {
      margin:0;
      padding:0;
      -ms-content-zooming:none;
  }
</style>
<link href="css/default.css" rel="stylesheet" />
</head>
<body>
    <div id="container"></div>
    
    <div id="pp-mask">
        <div class="pp-intro-title">Welcome to Puppet Play!</div>
        <div class="pp-intro-arm">Spin the wheel to move the puppet arms.</div>
        <div class="pp-intro-walk">Drag the wheel to walk the puppet.</div>
        <div class="pp-intro-rotate">Spin the stick to roate the puppet.</div>
    </div>
    <div id="pp-welcome">
        <div class="pp-inner-ct">
            <div class="pp-title">Welcome to Puppet Play!</div>
            <div class="pp-link">Click to begin</div>
        </div>
    </div>
	<div id="debugger"></div>
    <audio id="audioRotate" msAudioCategory="BackgroundCapableMedia"> 
        <source src="sounds/rotate.wav"/> 
    </audio>
    <audio id="audioWalk" msAudioCategory="BackgroundCapableMedia"> 
        <source src="sounds/walk.wav"/> 
    </audio>
    <audio id="audioBg" msAudioCategory="BackgroundCapableMedia" autoplay="autoplay" loop="loop"> 
        <source src="sounds/bg.wav"/> 
    </audio>
<script src="js/kinetic-v4.0.3.js"></script>
<script src="js/Setting.js"></script>
<script src="js/Util.js"></script>
<script src="js/Image.js"></script>
<script src="js/Puppet.js"></script>
<script src="js/Pulley.js"></script>
<script src="js/RotationBoard.js"></script>
<script src="js/MoveHandle.js"></script>
<script src="js/ControlStick.js"></script>
<script src="js/AppBar.js"></script>
<script src="js/Background.js"></script>
<script src="js/StageScenery.js"></script>
<script src="js/ImageCache.js"></script>
<script src="js/main.js"></script>
</body>
</html>